<template>
  <div class="app-container-flex">
    <NewFullScreen
      v-model:modelValue="showDialog"
      :title="title"
      @returnBack="$emit('returnBack')"
      :btn-list="fullInfo.btnList"
    >
      <div class="model-panel">
        <div class="model-panel-title">
          <p>{{ $t('basic_information') }}</p>
        </div>
        <div class="model-panel-body">
          <page-form
            class="paddingBox order-model-formBox flex_wrap_start_start"
            v-model:ref-obj="formInfo.ref"
            :data="formInfo.data"
            :field-list="formInfo.fieldList"
            :label-width="formInfo.labelWidth"
            :rules="formInfo.rules"
          >
            <template v-slot:form-brandLicenseFilePath>
              <div class="slot-brandLicenseFilePath">
                <upload-img
                  v-model:value="formInfo.data.brandLicenseFilePaths"
                  multiple
                  :action="action"
                  title="资质"
                  :limit="
                    $store.state.permission.systemConfig.max_upload_picture
                      ? $store.state.permission.systemConfig.max_upload_picture
                      : 2
                  "
                  :response-fn="handleResponse"
                />
              </div>
            </template>
          </page-form>
        </div>
      </div>
    </NewFullScreen>
  </div>
</template>

<script setup name="BrandModify">
import {
  createBrand,
  updateBrand,
  brandDetail,
  getCoreCodeStatus,
} from '@/api/core.js'
import axios from 'axios'
const { proxy } = getCurrentInstance()
const emits = defineEmits()
const props = defineProps({
  disabled: {
    type: Boolean,
    default: false,
  },
  id: {
    type: String,
  },
  title: {
    type: Boolean,
  },
  type: {
    type: Boolean,
  },
})
const action = ref(axios.defaults.baseURL + '/pub/uploadfile')
const formInfo = ref({
  ref: null,
  data: {},
  fieldList: [
    { label: '厂家名称', value: 'name', type: 'input', required: true },
    {
      label: '厂家编码',
      value: 'code',
      type: 'input',
      required: true,
      show: true,
    },
    {
      label: '营业执照',
      value: 'businessLicense',
      type: 'date',
    },
    {
      label: '医疗器械生产许可',
      value: 'medicalDeviceLicense',
      type: 'date',
    },
    {
      // label: "第一类医疗器械生产备案",
      label: '医疗器械生产备案',
      value: 'firstMedicalDeviceFiling',
      type: 'date',
    },
    {
      // label: "生产企业卫生许可证",
      label: '卫生许可证',
      value: 'sanitaryLicense',
      type: 'date',
    },
    {
      label: '经营许可证',
      value: 'operatingPermit',
      type: 'date',
    },
    {
      label: '备注',
      value: 'remark',
      type: 'textarea',
    },
    {
      label: '资质',
      value: 'brandLicenseFilePath',
      type: 'slot',
      className: 'not-br',
    },
  ],
  rules: {
    name: [{ required: true, message: '请输入厂家名称', trigger: 'blur' }],
    code: [
      { required: true, message: '请输入厂家编码', trigger: 'blur' },
      { validator: proxy.$validate.validatEn, trigger: 'blur' },
    ],
  },
  labelWidth: '150px',
})
const fullInfo = ref({
  btnList: [{ label: '保存', event: save, show: true }],
})

const showDialog = computed({
  get() {
    return props.visible
  },
  set(val) {
    // 更新父组件visible
    emits('update:visible', val)
  },
})
watch(
  () => props.visible,
  (val) => {
    showDialog.value = val
  }
)

function save() {
  const _formInfo = formInfo.value
  formInfo.value.ref.validate((valid, obj) => {
    if (valid) {
      let api
      const params = _formInfo.data
      const type = props.type

      if (type === 'create') {
        api = createBrand
      } else if (type === 'update') {
        api = updateBrand
      } else {
        return
      }
      formInfo.value.data.brandLicenseFilePath =
        formInfo.value.data.brandLicenseFilePaths &&
        formInfo.value.data.brandLicenseFilePaths.length > 0
          ? formInfo.value.data.brandLicenseFilePaths.join(',')
          : ''

      proxy
        .$handleAPI(type, api, params)
        .then((res) => {
          if (res.success) {
            showDialog.value = false
            emits('returnBack', false)
          }
        })
        .catch((e) => {
          //
          console.log(e)
        })
    }
  })
}
function getDetails() {
  if (props.id) {
    brandDetail(props.id).then((resp) => {
      if (resp && resp.success) {
        formInfo.value.data = resp.data
      }
    })
  }
}

function handleResponse(response) {
  return response
}
function getStatus() {
  getCoreCodeStatus({ codeType: '3' }).then((res) => {
    formInfo.value.fieldList[1].show = !res.data
    // 影响到首次进入页面校验问题，没发现其作用暂注释
    // formInfo.value.rules.code[1].required = !res.data
  })
}

onMounted(() => {
  getStatus()
  if (props.id) {
    getDetails()
  }
})
</script>

<style scoped></style>
